<template>
<div>
	<div>{{$store.state.name}}</div>
	<input value="点我呀" type="button" @click="setDefaultNameAction"/>
	<input
    placeholder="请输入内容"
    v-model="name"
    @change="setNameAction"
    clearable>
  </input>
</div>
</template>
<script>
export default {
  data () {
    return {
      name: ''
    }
  },
  methods:{
  	setDefaultName(){
		this.$store.commit('changeName')
  	},
  	setDefaultNameAction(){
  		this.$store.dispatch('changeNameAction')
  	},
  	setName(){
  		console.log(this)
  		// this.$store.commit('changeNameParams',{
  		// 	name:this.name
  		// })
  		this.$store.commit({
  			type:'changeNameParams',
  			name:this.name
  		})
  	},
  	setNameAction(){
  		// this.$store.dispatch('changeNameParams',{
  		// 	name:this.name
  		// })
  		this.$store.dispatch({
  			type:'changeNameParamsAction',
  			name:this.name
  		})
  	}
  }
}
</script>